<template>
  <el-dialog title="套餐查询" :visible.sync="dialogVisible" fullscreen center>
    <el-button class="miui-dialog-close-btn" @click="dialogVisible = false">关闭页面</el-button>
    <el-table :data="dataList" border v-loading="dataListLoading">
      <el-table-column label="操作" width="120">
        <template slot-scope="scope">
          <el-button type="text" icon="el-icon-check" @click="checkItem(scope.row)">选择</el-button>
          <el-button type="text" icon="el-icon-collection" @click="checkDetail(scope.row.id)">详情</el-button>
        </template>
      </el-table-column>
      <el-table-column prop="title" label="套餐标题"></el-table-column>
      <el-table-column prop="setmealModel" label="套餐形式">
        <template slot-scope="scope">
          <span v-if="scope.row.setmealModel == '1'">单一优惠方式</span>
          <span v-if="scope.row.setmealModel == '2'">多种优惠方式</span>
        </template>
      </el-table-column>
      <el-table-column prop="preferentialWay" label="优惠形式">
        <template slot-scope="scope">
          <span v-if="scope.row.preferentialWay == '2'">打折</span>
          <span v-if="scope.row.preferentialWay == '3'">返现</span>
          <span v-if="scope.row.preferentialWay == '4'">特价</span>
        </template>
      </el-table-column>
      <el-table-column prop="allowDiscount" label="折上折">
        <template slot-scope="scope">
          <span v-if="scope.row.allowDiscount == '1'">允许</span>
          <span v-if="scope.row.allowDiscount == '0'">不允许</span>
        </template>
      </el-table-column>
      <el-table-column prop="type" label="套餐分类">
        <template slot-scope="scope">
          <span v-if="scope.row.type == '4'">框镜销售</span>
          <span v-if="scope.row.type == '3'">隐形销售</span>
          <span v-if="scope.row.type == '5'">辅料销售</span>
        </template>
      </el-table-column>
      <el-table-column prop="startTime" label="生效日期"></el-table-column>
      <el-table-column prop="endTime" label="截止日期"></el-table-column>
    </el-table>
    <div class="avue-crud__pagination">
      <el-pagination
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="pageIndex"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        :total="totalPage"
        background
        layout="total, sizes, prev, pager, next"
      >
      </el-pagination>
    </div>
    <meal-detail v-if="mealDetailVisible" ref="mealDetail"></meal-detail>
  </el-dialog>
</template>

<script>
  import {filterParams} from '@/util/tools'
  import {setMealFetchList,getUsableMealList} from '@/api/eims/set-meal'
  import MealDetail from '@/views/eims/setmeal/setmeal-detail'
  export default {
    props: [],
    data() {
      return {
        dataForm: {
        },
        dialogVisible: false,
        dataList: [],
        pageIndex: 1,
        pageSize: 100,
        totalPage: 0,
        dataListLoading: false,
        mealDetailVisible: false
      }
    },
    components:{
      MealDetail
    },
    methods: {
      init(data) {
        this.dataForm = data
        this.dialogVisible = true
        this.$nextTick(() => {
          this.getDataList()
        })
      },
      // 获取数据列表
      getDataList() {
        let params1 = { current: this.pageIndex, size: this.pageSize }
        let params2 = filterParams(this.dataForm)
        getUsableMealList(Object.assign(params1,params2)).then(response => {
          if(response.data.code == '0'){
            this.dataList = response.data.data
          }else{
            this.$message.error(response.data.msg)
          }
        })
      },
      sizeChangeHandle(val){
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      currentChangeHandle(val){
        this.pageIndex = val
        this.getDataList()
      },
      // 查看详情
      checkDetail(id) {
        this.mealDetailVisible = true
        this.$nextTick(() => {
          this.$refs.mealDetail.init(id)
        })
      },
      // 选择套餐
      checkItem(row){
        let data = {type: row.preferentialWay,typeInfo: row.preferentialWayInfo}
        this.dialogVisible = false
        this.$emit('refreshForm',data)
      }
    }
  }
</script>

<style>
</style>
